<template>
  <div class="">
    <section1 />
    <div class="container mx-auto">
      <this-tabs @on-tab="onTab">
        <this-list ref="list" />
      </this-tabs>

      <div class="text-center text-base text-gray-99 lg:mt-20 my-10 lg:mb-16">
        没有更多了~
      </div>
    </div>
    <!-- <section2 /> -->

    <!-- <section3 /> -->
  </div>
</template>

<script>
import section1 from "./s1.vue";
// import section2 from "./s2.vue";
// import section3 from "./s3.vue";
import thisTabs from "./tabs.vue";
import thisList from "./list.vue";

export default {
  components: {
    section1,
    thisTabs,
    thisList,
    //  section2,
    //  section3
  },
  data() {
    return {
      active: 2,
    };
  },
  methods: {
    onTab(title) {
      this.$nextTick(() => {
        this.$refs.list.load(title);
      });
    },
  },
};
</script>

<style>
</style>